---

---

<a
  target="_blank"
  rel="noreferrer noopener"
  href="https://reactnativeunistyles.vercel.app/"
  class="group hover:no-underline relative overflow-hidden shadow-[inset_0_0_3rem_#fff4] hover:shadow-[inset_0_0_3rem_#fff4,0_0_2rem_#fff4] border-pink-200/40 hover:border-pink-300/70 bg-gradient-to-tl from-emerald-400/10 via-indigo-400/10 to-purple-400/10 backdrop-blur-sm text-pink-100 p-4 flex-grow rounded-3xl hover:saturate-150 hover:brightness-110 flex flex-col items-start duration-500 border"
>
  <img
    class="absolute right-2 top-2 opacity-40 sm:opacity-80 sm:group-hover:opacity-100 -z-[1] group-hover:rotate-[360deg] group-hover:-translate-x-3 group-hover:translate-y-3 duration-700"
    src="/stack/unistyles.svg"
    alt="unistyles"
    width={56}
    height={56}
  />
  <div
    class="bg-gradient-to-br from-emerald-300/90 via-indigo-300/90 to-purple-300/90 duration-500 font-bold text-black rounded-full px-2 text-sm"
  >
    v3
  </div>
  <h1
    class="text-2xl font-semibold mt-2 bg-gradient-to-br from-emerald-300 via-indigo-200 to-purple-300 bg-clip-text text-transparent"
  >
    Unistyles
  </h1>
  <span
    class="font-thin max-w-[24ch] mt-1 opacity-70 group-hover:opacity-100 duration-1000"
  >
    Superset of StyleSheet
  </span>
</a>
